<template>
  <div>
    <el-table
      :data="tableData"
      border
      style="width: 100%">
      <el-table-column
        type="index"
        align="center"
        label="序号"
        width="60">
      </el-table-column>
      <el-table-column
        prop="boxCode"
        align="center"
        label="对应箱码"
        min-width="100">
      </el-table-column>
      <el-table-column
        prop="productCode"
        label="流通码"
        align="center"
        min-width="130">
      </el-table-column>
      <el-table-column
        prop="scanCount"
        label="扫码次数"
        align="center"
        min-width="80">
      </el-table-column>
      <el-table-column
        prop="scanTime"
        label="最近扫码时间"
        align="center"
        min-width="160">
      </el-table-column>
      <el-table-column
        prop="scanAddr"
        label="最近扫码地区"
        align="center"
        min-width="130">
      </el-table-column>
      <el-table-column
        prop="scanMemberName"
        label="最近扫码经销商"
        align="center"
        min-width="130">
      </el-table-column>
      <el-table-column
        label="操作"
        align="center"
        min-width="100">
        <template slot-scope="scope">
               <el-button
                 size="mini"
                 @click="handleEdit(scope.$index, scope.row)">查看详情</el-button>
        </template>
      </el-table-column>
    </el-table>
    <div class="pagetbnBox">
      <div class="lipagination">
        <el-pagination
          background
          :current-page.sync="currentPage"
          @current-change="handleCurrentChange"
            :page-size="10"
            :pager-count="5"
            layout="total, prev, pager, next"
            :total="total" hide-on-single-page>
          </el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    tableData: Array,
    total: Number
  },
  data () {
    return {
      currentPage: ''
    }
  },
  methods: {
    handleEdit (index, row) {
      console.log(index, row)
      this.$router.push({
        name: 'codeDetail',
        params: {
          'index': index,
          'row': row
        }
      })
    },
    handleCurrentChange (val) {
      this.currentPage = val
      this.$parent.init(this.currentPage)
    }
  },
  created () {
    this.currentPage = Number(localStorage.getItem('currentPage')) || 1
    this.$parent.init(this.currentPage)
  },
  beforeUpdate () {
    localStorage.setItem('currentPage', this.currentPage)
  }
}
</script>

<style lang="stylus" scoped>
.block{
  float right
  padding 20px 0 0 0
}
</style>
